<template>
  <div class="banner">
    <div class="main">

<!--      专题头版部分-->
  <header class="symposia-header">
    <div class="symposia-header-left">
      <div class="symposia-decoration symposia-decoration-1">1921</div>
      <div class="symposia-decoration symposia-decoration-2">2024</div>

      <h2 class="symposia-title-1">
        学习贯彻
        <br>党的二十大精神
      </h2>
      <div class="symposia-header-button">
        开始学习
      </div>
    </div>
    <div class="symposia-header-right">
    </div>
  </header>

  <div class="symposia-content">

    <!--            ///////////////////////////////-->
    <!--            聚焦报告部分-->
    <section class="symposia-report">
      <h3 class="symposia-title-2">聚焦报告</h3>
      <div class="symposia-report-content">
        <div class="symposia-report-left">
          <div class="symposia-report-img">
          </div>
        </div>
        <div class="symposia-report-right">
          <h3 class="symposia-title-3">
            习近平：高举中国特色社会主义伟大旗帜 为全面建设社会主义现代化国家而团结奋斗
          </h3>
          <p class="symposia-report-text">
            一年来，全军坚持用习近平新时代中国特色社会主义思想特别是习近平强军思想铸魂育人，坚决贯彻党中央、中央军委和习主席决策部署，按照学史明理、学史增信、学史崇德、学史力行的要求，学党史、悟思想、办实事、开新局，党史学习教育求实、务实、扎实。广大官兵受到一次全面深刻的政治教育、思想淬炼、精神洗礼，深刻认识“两个确立”的决定性意义，增强“四个意识”、坚定“四个自信”、做到“两个维护”，贯彻军委主席负责制，以更加昂扬姿态投身强军实践，满怀信心奋进新征程、建功新时代。
          </p>
        </div>
      </div>

      <!--                聚焦报告list部分-->
      <div class="symposia-report-other">

        <ul class="symposia-report-module-1">
          <li class="symposia-report-list-1">
            “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
          </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li><li class="symposia-report-list-1">
          “国家卓越工程师”万步炎：让中国深海钻探更有“深度”
        </li>
        </ul>
        <div class="symposia-report-module-2">
          <div class="symposia-report-item">
            <div class="symposia-report-module-2-header">
              <div class="symposia-decoration-7"></div>
              <h3 class="symposia-report-2-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h3>
            </div>
            <div class="symposia-report-module-2-content">
              <p class="symposia-report-2-text">十九大以来的五年，是极不寻常、极不平凡的五年。党中央统筹中华民族伟大复兴战略全局和世界百年未有之大变局，召开七次全会，分别就宪法修改，深化党和国家机构改革，坚持和完善中国特色社会主义制度、推进国家治理体系和治理能力现代化</p>
            </div>
          </div>
          <div class="symposia-report-item">
            <div class="symposia-report-module-2-header">
              <div class="symposia-decoration-7"></div>
              <h3 class="symposia-report-2-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h3>
            </div>
            <div class="symposia-report-module-2-content">
              <p class="symposia-report-2-text">十九大以来的五年，是极不寻常、极不平凡的五年。党中央统筹中华民族伟大复兴战略全局和世界百年未有之大变局，召开七次全会，分别就宪法修改，深化党和国家机构改革，坚持和完善中国特色社会主义制度、推进国家治理体系和治理能力现代化</p>
            </div>
          </div>
          <div class="symposia-report-item">
            <div class="symposia-report-module-2-header">
              <div class="symposia-decoration-7"></div>
              <h3 class="symposia-report-2-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h3>
            </div>
            <div class="symposia-report-module-2-content">
              <p class="symposia-report-2-text">十九大以来的五年，是极不寻常、极不平凡的五年。党中央统筹中华民族伟大复兴战略全局和世界百年未有之大变局，召开七次全会，分别就宪法修改，深化党和国家机构改革，坚持和完善中国特色社会主义制度、推进国家治理体系和治理能力现代化</p>
            </div>
          </div>
        </div>

      </div>
      <!--                <div class="symposia-decoration-4"></div>-->
    </section>


    <!--            ///////////////////////////////////-->
    <!--            专题观点模块-->
    <section class="symposia-views">
      <h3 class="symposia-title-2">专题观点</h3>
      <ul class="symposia-views-module">
        <li class="symposia-views-list">
          <div class="symposia-decoration-6"></div>
          <h3 class="symposia-views-list-title">
            高举中国特色社会主义伟大旗帜 为全面建设社会主义现代化国家而团结奋斗
          </h3>
          <p class="symposia-views-list-text">
            十九大以来的五年，是极不寻常、极不平凡的五年。党中央统筹中华民族伟大复兴战略全局和世界百年未有之大变局，召开七次全会，分别就宪法修改，深化党和国家机构改革，坚持和完善中国特色社会主义制度...
          </p>
          <div class="symposia-views-list-footer">
            <div class="symposia-views-list-img">

            </div>
            <div class="symposia-views-list-name">习近平</div>
            <div class="symposia-views-button">阅读</div>

          </div>
        </li>
        <li class="symposia-views-list">
          <div class="symposia-decoration-6"></div>
          <h3 class="symposia-views-list-title">
            高举中国特色社会主义伟大旗帜 为全面建设社会主义现代化国家而团结奋斗
          </h3>
          <p class="symposia-views-list-text">
            十九大以来的五年，是极不寻常、极不平凡的五年。党中央统筹中华民族伟大复兴战略全局和世界百年未有之大变局，召开七次全会，分别就宪法修改，深化党和国家机构改革，坚持和完善中国特色社会主义制度...
          </p>
          <div class="symposia-views-list-footer">
            <div class="symposia-views-list-img">

            </div>
            <div class="symposia-views-list-name">习近平</div>
            <div class="symposia-views-button">阅读</div>
          </div>
        </li>
        <li class="symposia-views-list">
          <div class="symposia-decoration-6"></div>
          <h3 class="symposia-views-list-title">
            高举中国特色社会主义伟大旗帜 为全面建设社会主义现代化国家而团结奋斗
          </h3>
          <p class="symposia-views-list-text">
            十九大以来的五年，是极不寻常、极不平凡的五年。党中央统筹中华民族伟大复兴战略全局和世界百年未有之大变局，召开七次全会，分别就宪法修改，深化党和国家机构改革，坚持和完善中国特色社会主义制度...
          </p>
          <div class="symposia-views-list-footer">
            <div class="symposia-views-list-img">

            </div>
            <div class="symposia-views-list-name">习近平</div>
            <div class="symposia-views-button">阅读</div>

          </div>
        </li>
      </ul>
    </section>

    <!--            这里symposia-content-2与前面symposia-content不能用一个统一原因是这里有两个模块并排的-->
    <div class="symposia-content-2">
      <!--                    ///////////////////////////-->
      <!--                    专题热点模块-->
      <section class="symposia-fire">
        <div class="symposia-decoration-3">
          <div class="symposia-decoration-4"></div>
        </div>
        <h3 class="symposia-title-2">专题热点</h3>
        <p class="symposia-fire-text">
          “希望全国广大工程技术人员坚定科技报国、为民造福理想，勇于突破关键核心技术，锻造精品工程，推动发展新质生产力，加快实现高水平科技自立自强，服务高质量发展，为以中国式现代化全面推进强国建设、民族复兴伟业作出更大贡献。”        近日，习近平总书记在“国家工程师奖”首次评选表彰之际作出重要指示，对广大工程技术人员提出殷切希望，强调工程师在党和国家事业全局中的重要作用，为推动新时代工程师队伍建设指明了前进方向。        总书记的重要指示必将鼓舞我国广大工程技术人员精研业务、埋头苦干，不断突破关键核心技术，铸造新的精品工程、“大国重器”。
        </p>
      </section>

      <!--                    ////////////////////////////-->
      <!--                    工作部署-->
      <section class="symposia-deployment">
        <div class="symposia-decoration-3">
          <div class="symposia-decoration-4"></div>
        </div>
        <h3 class="symposia-title-2">工作部署</h3>
        <div class="symposia-deployment-item">
          <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
          <div class="symposia-deployment-inspect"> > </div>
        </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div><div class="symposia-deployment-item">
        <h4 class="symposia-deployment-title">“国家卓越工程师”万步炎：让中国深海钻探更有“深度”</h4>
        <div class="symposia-deployment-inspect"> > </div>
      </div>
      </section>
    </div>

    <!--            ////////////////////////////////-->
    <!--            视频新闻模块-->
    <section class="symposia-video">

      <div class="symposia-video-item">
        <div class="symposia-video-left">
          <h3 class="symposia-title-4">视频<strong>新闻</strong></h3>
          <div class="symposia-video-num"><strong>100+</strong>条
            <br>学习视频</div>
        </div>
        <div class="symposia-video-right">
          <div class="symposia-video-list symposia-video-list-1">
            <div class="symposia-video-list-header">
              <div class="symposia-video-button-svg"></div>
            </div>
            <div class="symposia-video-list-title">
              《国史讲堂》——“党史微课”系列短视频
            </div>
          </div><div class="symposia-video-list symposia-video-list-2">
          <div class="symposia-video-list-header">
            <div class="symposia-video-button-svg"></div>
          </div>
          <div class="symposia-video-list-title">
            《国史讲堂》——“党史微课”系列短视频
          </div>
        </div><div class="symposia-video-list symposia-video-list-3">
          <div class="symposia-video-list-header">
            <div class="symposia-video-button-svg"></div>
          </div>
          <div class="symposia-video-list-title">
            《国史讲堂》——“党史微课”系列短视频
          </div>
        </div>
        </div>

        <div class="symposia-video-more">
          <div class="symposia-video-more-svg"></div>
          <div class="symposia-video-more-text">了解更多</div>
        </div>
      </div>

    </section>

    <!--            ////////////////////////////////-->
    <!--            专题书籍部分-->
    <section class="symposia-book">
      <div class="symposia-book-header">
        <h3 class="symposia-title-2">专题书籍</h3>

      </div>
      <!--                <div class="symposia-book-button-item">-->
      <div class="symposia-book-button symposia-book-button-1"> ◂ </div>
      <div class="symposia-book-button symposia-book-button-2"> ▸ </div>
      <!--                </div>-->

      <div class="symposia-book-content">

        <div class="symposia-book-content-item">
          <div class="symposia-book-content-header">
            <div class="symposia-book-img symposia-book-img-1">

            </div>
          </div>

        </div>
        <div class="symposia-book-content-item">
          <div class="symposia-book-content-header">
            <div class="symposia-book-img symposia-book-img-2">

            </div>
          </div>

        </div>
        <div class="symposia-book-content-item">
          <div class="symposia-book-content-header">
            <div class="symposia-book-img symposia-book-img-3">

            </div>
          </div>

        </div>
        <div class="symposia-book-content-item">
          <div class="symposia-book-content-header">
            <div class="symposia-book-img symposia-book-img-4">

            </div>
          </div>

        </div>
        <div class="symposia-book-content-item">
          <div class="symposia-book-content-header">
            <div class="symposia-book-img symposia-book-img-5">

            </div>
          </div>

        </div>

      </div>

    </section>


    <!--            更多专题模块-->
    <section class="symposia-more-section">
      <div class="symposia-more-year">
        <div class="symposia-more-header">
          <div class="symposia-decoration-5"></div>
          <h4 class="symposia-more-title">2024年专题</h4>
        </div>
        <div class="symposia-more-content">
          聚焦二十届中央纪委三次全会
        </div>
        <div class="symposia-more-content">
          聚焦二十届中央纪委三次全会
        </div>
        <div class="symposia-more-content">
          聚焦二十届中央纪委三次全会
        </div>
      </div>
      <div class="symposia-more-year">
        <div class="symposia-more-header">
          <div class="symposia-decoration-5"></div>
          <h4 class="symposia-more-title">2023年专题</h4>
        </div>
        <div class="symposia-more-content">
          第六届中央企业优秀故事创作展示活动两会调查·融观察
        </div>
        <div class="symposia-more-content">
          第六届中央企业优秀故事创作展示活动两会调查·融观察
        </div>
        <div class="symposia-more-content">
          第六届中央企业优秀故事创作展示活动两会调查·融观察
        </div>
      </div>
      <div class="symposia-more-year">
        <div class="symposia-more-header">
          <div class="symposia-decoration-5"></div>
          <h4 class="symposia-more-title">2022年专题</h4>
        </div>
        <div class="symposia-more-content">
          聚焦二十届中央纪委三次全会
        </div>
        <div class="symposia-more-content">
          聚焦二十届中央纪委三次全会
        </div>
        <div class="symposia-more-content">
          聚焦二十届中央纪委三次全会
        </div>
      </div>
    </section>

  </div>
    </div>
  </div>
</template>

<style scoped>

/*css基本处理*/
*,
*::after,
*::before{
  margin:0;
  padding:0;
  box-sizing:border-box;
}
html{
  font-size:62.5%;
  /*设置根字体大小为10px,即1rem=10px*/
}
body{
  background-color: rgba(229, 229, 229, 1);

}
.banner{
  width: 151.3rem;
  margin: 0 auto;
  background-color: rgba(229, 229, 229, 1);
  padding: 0.5rem 0;
  //padding-bottom: 10rem;
  /*background-color: lightskyblue;*/
  /*//background-color: #0077aa;*/
}
/*.center{*/
/*    width:100%;*/
/*    !*background-color: yellow;*!*/
/*    margin: 0 auto;*/
/*    letter-spacing: 3px;*/
/*}*/

.main{
  width:108rem;
  /*height:50rem;*/
  margin: 0 auto;
}

.symposia-content{
  width:100%;
  /*height: 50rem;*/
  padding: 2rem;
  background-color: white;
}

.symposia-header{
  display: flex;
  width:100%;
  height: 48rem;
  padding: 2rem;
  position: relative;
  background-color: white;
  /*margin-bottom: 1rem;*/
  border-bottom: 1px solid #ccc;
}
.symposia-header-left{
  width:35%;
  height:100%;

}
.symposia-title-1{
  font-size: 4rem;
  font-weight: bolder;
  font-family: 楷体;
  /*text-align: center;*/
  margin-top: 10rem;
  margin-left: 7rem;
  line-height: 7rem;
  z-index: 10;
  /*text-indent: -3rem;*/
  position: absolute;
}
.symposia-decoration{
  position: absolute;
  font-size: 7rem;
  letter-spacing: 5px;
  /*font-family: 华文中宋;*/
  color:#E6E8E6;
  font-weight: bolder;

  z-index: 1;

}
.symposia-decoration-1{
  top:20%;
  /*top:15%;*/
  left: 2%;
}
.symposia-decoration-2{
  /*top:55%;*/
  top:40%;
  left: 15%;
}
/*.symposia-decoration-3{*/
/*    display: flex;*/
/*    margin: 0 auto;*/
/*    width:8rem;*/

/*}*/
.symposia-header-button{
  /*position: absolute;*/
  margin: 0 auto;
  margin-top: 32rem;
  width:18rem;
  height:2.5rem;
  background-color: darkred;
  color:white;
  line-height: 2.5rem;
  text-align: center;
  font-size: 1.6rem;
  font-weight: bolder;
  clip-path: polygon(0 0,100% 0,95% 50%,100% 100%,0% 100%,5% 50%,0 0);
}
.symposia-header-right{
  flex: 1;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover ;
  background-image: url("src/assets/images/symposia-header-2.png");
}
/*.symposia-title-2{*/
/*    font-weight: bolder;*/
/*    font-size: 1.6rem;*/
/*    text-align: center;*/
/*    !*letter-spacing: 2px;*!*/
/*    color: rgb(128,0,0);*/
/*}*/
/*///////////////////////////////*/
/*聚焦报告*/
.symposia-report{
  width:100%;
  /*height:35rem;*/
  padding:2rem 5rem;
  padding-bottom: 0;
}
/*.symposia-report-header{*/
/*    height:5rem;*/
/*    display: flex;*/
/*    line-height: 5rem;*/
/*    padding-left: 1rem;*/
/*    justify-content: space-between;*/
/*}*/
/*.symposia-more-select{*/
/*    color: #878787;*/
/*    font-size: 1.3rem;*/
/*}*/
.symposia-title-2{
  margin: 1rem;
  cursor: pointer;
  /*margin-left: 1rem;*/
  font-size: 2rem;
  color: rgb(128,0,0);
  letter-spacing: 2px;
}
.symposia-report-content{
  display: flex;
  justify-content: space-between;
}
.symposia-report-left{
  width:35rem;
  padding-bottom: 1rem;
  border-bottom: 0.5px solid gainsboro;
}
.symposia-report-img{
  width:35rem;
  height:25rem;
  background-image:url("src/assets/images/symposia-report-img-1.jpg");
  /*margin-left: 5rem;*/
  /*margin-top: 5rem;*/
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  /*z-index: 5;*/
  /*position: absolute;*/
}

.symposia-report-right{
  flex: 1;
  padding-left: 5rem;
  position: relative;
}
.symposia-title-3{
  /*width:100%;*/
  margin: 0 auto;
  font-size: 2rem;
}
.symposia-report-text{
  font-size: 1.5rem;
  color: darkgray;
  margin-top: 0.5rem;
  line-height: 2.5rem;
}
.symposia-report-button{
  width:20rem;
  height:3.5rem;
  text-align: center;
  line-height: 3rem;
  font-weight: bolder;
  /*margin-left:6rem;*/
  /*margin: 0 auto;*/
  /*margin-top: 1rem;*/
  border-radius: 3px;
  color: rgb(128,0,0);
  position: absolute;
  left: 5rem;
  bottom:1rem;
  border: 3px solid rgb(128,0,0);
}

.symposia-report-other{
  width:100%;
  display: flex;
  justify-content: space-between;
}
.symposia-report-module-1{
  /*padding: 1rem;*/
  margin-left: 2rem;
  /*background-color: #B30000;*/
  /*background-color: rgba(0,0,0,0.1);*/
}
.symposia-report-list-1{
  color:dimgrey;
  margin-top: 2rem;
  font-size: 1.2rem;

}
.symposia-report-list-1{

}
.symposia-video-more-2{
  position:absolute;
  left:65%;
  /*left:20%;*/
  /*top:50%;*/
  width:20rem;
  height: 3.5rem;
  border-radius: 5rem;
  display: flex;
  background-color:rgba(250,250,250,0.5);
  background-color:black;
}
.symposia-report-module-2{
  width: 55rem;
  padding: 1rem;
  /*background-color: rgb(249,247,254);*/

}
.symposia-report-module-2-header {
  display: flex;
  margin-top: 2rem;

  /*height:5rem;*/
}
.symposia-report-module-2-header:first-child{
  margin-top: 1rem;
}
.symposia-decoration-7{
  width:1rem;
  background-color: rgb(128,0,0);
}
.symposia-report-2-title{
  height: 2rem;
  font-size: 1.5rem;
  line-height: 2rem;
  color: grey;
}
.symposia-report-module-2-content{
  padding-left: 2.5rem;
  color:#878787;
}
.symposia-report-2-text{
  line-height: 2rem;
}
/*//////////////////////////*/
/*专题观点*/
.symposia-views{
  width:100%;
  height: 36rem;
  padding:2rem 5rem;

}
.symposia-views-module{
  width:100%;
  display: flex;
  justify-content: space-around;
}
.symposia-views-list{
  width:27rem;
  height:25rem;
  list-style: none;
  padding:2rem;
  padding-top: 5rem;
  position: relative;
  background-color: rgb(249,247,254);
}
.symposia-views-list-title{
  font-size: 1.3rem;
  font-weight: bolder;
  margin-bottom: 0.5rem;
}

.symposia-views-list-text{
  width:100%;
  height:10rem;
  font-size: 1.2rem;
  line-height: 2rem;
  color: rgb(136,135,137);
}
.symposia-views-list-footer{
  display: flex;
  margin-top:1rem ;
}
.symposia-views-list-img{
  width:4rem;
  height:4rem;
  border-radius: 50%;
  background-image:url("src/assets/images/symposia-report-img-1.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.symposia-views-list-name{
  font-weight: bolder;
  line-height: 4rem;
  font-size: 1.3rem;
  margin-left: 2rem;
}
.symposia-views-button{
  width:6rem;
  height:3rem;
  text-align: center;
  border-radius: 0.5rem;
  line-height:3rem ;
  position: absolute;
  right: 2rem;
  bottom: 1.5rem;
  font-size: 1.3rem;
  font-weight: bolder;
  color: white;
  background-color: #B30000;
}
.symposia-decoration-6{
  cursor: pointer;
  width:3rem;
  height:3rem;
  position: absolute;
  right: 5%;
  top: 5%;
  background-image: url("src/assets/svg/symposia-apostrophe.svg");
  background-repeat: no-repeat;
  background-size: 2rem 2rem;
  background-position: center;
}


/*////////////////////////////*/
/*专题热点*/

.symposia-content-2{
  display: flex;
  padding:2rem 5rem;
  justify-content: space-between;
}
.symposia-fire{
  height:38rem;

  width:35rem;
  padding-bottom: 0;
}
.symposia-decoration-3{
  width:100%;
  height:2px;
  background-color:#ccc;
}
.symposia-decoration-4{
  width:10rem;
  height:0.5rem;
  background-color:rgb(128,0,0);
}
.symposia-fire-text{
  width:100%;
  font-size: 1.3rem;
  letter-spacing: 1.5px;
  line-height: 2.4rem;
}

/*//////////////*/
/*工作部署*/
.symposia-deployment{
  /*width:50rem;*/
  width:47rem;
  /*width:50rem;*/
  height:38rem;
}
.symposia-deployment-item{
  height:3.5rem;
  display: flex;
  padding:0rem 1rem;
  border-bottom: 1px solid #ccc;
  justify-content: space-around;
}

.symposia-deployment-title{
  font-size: 1.3rem;
  line-height: 3.5rem;
  letter-spacing: 1.5px;
}
.symposia-deployment-inspect{
  width: 1.5rem;
  height:1.5rem;
  color: white;
  line-height: 1.5rem;
  font-size: 1.3rem;
  text-align: center;
  font-weight: bolder;
  margin-top: 1rem;
  background-color: rgb(128,0,0);
}

/*///////////////////////////////*/
/*视频*/
.symposia-video{
  width:100%;
  height:40rem;
  padding: 6rem;
  background-image: linear-gradient(to right,rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url("src/assets/images/symposia-video-back-3.png");
  background-repeat: no-repeat;
  background-size:cover;
  background-position:center;
}
.symposia-video-item{
  display: flex;
  position: relative;
}
.symposia-video-left{
  width:30%;
  font-weight: bolder;
  /*background-color: yellow;*/
}
.symposia-title-4{
  font-size: 4rem;
  /*font-family: 华文中宋;*/
  color:#C3C4C3;
  /*color: #F3F5F3;*/

}
.symposia-title-4 strong{
  font-size: 5rem;
  color: #878787;
}

.symposia-video-num{

  font-size: 3rem;
  color:#878787;
  line-height: 5rem;
  margin: 3rem 2rem;
}
.symposia-video-num strong {
  color:#B30000;
  font-size: 3.5rem;
}
.symposia-video-right{
  flex: 1;
  display: flex;
  margin-top: 1rem;
}
.symposia-video-list{
  width:20rem;
  height:20rem;
  padding: 1rem;
}
.symposia-video-list-header{
  /*width:90%;*/
  margin: 0 auto;
  height:10rem;
  width:10rem;
  background-image:url("src/assets/images/symposia-video-1.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 50%;
  padding-top: 3rem;
  outline:1.5rem solid rgba(250,250,250,0.3);
}
.symposia-video-button-svg{
  cursor: pointer;
  width:3.5rem;
  height:3.5rem;
  margin: 0 auto;
  background-image:url("src/assets/svg/symposia-broadcast.svg");
  background-repeat: no-repeat;
  background-size: 3.5rem 3.5rem;
  background-position: center;
}

.symposia-video-list-title{
  font-size: 1.3rem;
  letter-spacing: 2px;
  color:#C3C4C3;
  line-height: 2.5rem;
  margin: 0 auto;
  margin-top: 2rem;
  text-align:left;
  font-weight: bolder;
}

.symposia-video-more{
  position: absolute;
  left:50%;
  top:95%;
  transform: translate(-50%,95%);
  width:20rem;
  height: 4rem;
  height: 3.5rem;
  border-radius: 5rem;
  display: flex;
  background-color:rgba(250,250,250,0.5);
  background-color:black;
}
.symposia-video-more-svg{
  cursor: pointer;
  width:4rem;
  width:3.5rem;
  height:4rem;
  height:3.5rem;
  margin: 0 auto;
  background-image: url("src/assets/svg/symposia-study.svg");
  background-repeat: no-repeat;
  background-size: 2rem 2rem;
  background-size: 2rem 2rem;
  background-position: center;
  background-color:rgb(248,83,38);
  /*background-color:#B30000;*/
  border-radius: 50%;
  position: absolute;
  left:0;
}
.symposia-video-more-text{
  font-size: 1.8rem;
  font-size: 1.4rem;
  color:#E6E8E6;
  /*color:black;*/
  font-weight: bolder;
  line-height: 4rem;
  line-height: 3.5rem;
  letter-spacing: 3px;
  margin-left: 7rem;
}
/*////////////////////////*/
/*书籍*/
.symposia-book{
  width:100%;
  /*height:30rem;*/
  margin-top: 3rem;
  padding: 2rem 0rem;
  position: relative;
}
.symposia-book-header{
  padding-left: 5rem;
}

.symposia-book-button{
  width:3.5rem;
  font-size: 3.5rem;
  font-weight: bolder;
  text-align: center;
  line-height: 3rem;
  height:3.5rem;
  border-radius: 50%;
  border: 2px solid rgb(128,0,0);
  margin: 1rem;
  color: rgb(128,0,0);
  transition: all 0.1s linear;
  cursor: pointer;
  position: absolute;
  top:50%;
  z-index: 5;
}
.symposia-book-button:hover{
  background-color: rgb(128,0,0);
  color: white;
}
.symposia-book-button-1{
  left:-2rem;


}
.symposia-book-button-2{
  right:-2rem;
}
.symposia-book-content{
  width:100%;
  /*height:30rem;*/
  display: flex;
  position: relative;
  padding: 0 2rem;
  margin-top: 1rem;
  justify-content: space-around;
}
.symposia-book-content-item{
  width:16%;
}
.symposia-book-content-header{
  width:100%;
  height:20rem;
  background-color: rgb(243,243,243);
  position: relative;
}
.symposia-book-img{
  width:8rem;
  height:13rem;
  position: absolute;
  left:50%;
  top:50%;
  transform: translate(-50%,-50%);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.symposia-book-img-1{
  background-image: url("src/assets/images/symposia-book-1.png");
}
.symposia-book-img-2{
  background-image: url("src/assets/images/symposia-book-2.png");
}
.symposia-book-img-3{
  background-image: url("src/assets/images/symposia-book-3.png");
}
.symposia-book-img-4{
  background-image: url("src/assets/images/symposia-book-4.png");
}
.symposia-book-img-5{
  background-image: url("src/assets/images/symposia-book-4.png");
}

/*/////////////////////////////*/
/*更多专题*/
.symposia-more-section{
  margin-top: 4rem;
  padding:1rem 5rem;
  width:100%;
  /*height:30rem;*/
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #E6E8E6;
}
.symposia-more-year{

}
.symposia-more-header{
  display: flex;
  padding-top: 2rem;
}
.symposia-decoration-5{
  width:1.5rem;
  height:3rem;
  background-color:rgb(128,0,0);
}
.symposia-more-title{
  font-size: 2rem;
  line-height: 3rem;
  margin-left: 1rem;
  margin-bottom: 2rem;
}
.symposia-more-content{
  line-height: 5rem;
  font-size: 1.6rem;
  /*margin-top: 5rem;*/
}
</style>